<template>
  <section>
    <el-tabs v-model="pageName" v-if="pageName"  @tab-click="handleClick">
      <el-tab-pane :label="'第'+(index+1)+'页'" :name="page.id+page.title" v-for="(page,index) in qa.pages" :key="page.id">
        <edit v-for="questions in page.questions" :key="questions.key" :page="page" :question="page.question"></edit>
      </el-tab-pane>
    </el-tabs>
  </section>
</template>

<script>
  import edit from '../edit/index'
  export default {
    name: "index",
    props:['qa'],
    components:{edit},
    data(){
      return{
        pageName:null
      }
    },
    created(){
      console.log('看一下当前qa--------',this.qa)
      this.init(this.qa)
    },
    methods:{
      init(qa){
        //准备page里的问题
        qa.pages.forEach(page=>{
          page.questions=JSON.parse(page.metadata)
        })
        console.log('看一下格式化后的-------',qa.pages)
        this.pageName=qa.pages[0].id+qa.pages[0].title
      },
      handleClick(e){
        // console.log('切换的值是什么-------',e)
      }
    }
  }
</script>

<style scoped>

</style>
